<!DOCTYPE html>
<html>

	<head lang="en">
		<title>找攻略</title>
		<meta charset="utf-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
		<link rel="stylesheet" href="/js/bootstrap/css/bootstrap.min.css">
		<script src="/js/jquery/jquery.min.js"></script>
		<script src="/js/bootstrap/js/bootstrap.min.js"></script>
		<link rel="stylesheet" href="/css/font/css/font-awesome.min.css" />
		<link rel="stylesheet" href="/css/reset.css" />
		<link rel="stylesheet" href="/css/strategy.css" />
		<link rel="stylesheet" href="/js/plugins/dialog2/dialog.css" />
		<script src="/js/plugins/dialog2/dialog.min.js"></script>
		<script src="/js/plugins/jrender/jrender.min.js"></script>
		<link rel="stylesheet" href="/css/message.css"/>
		<link rel="stylesheet" type="text/css" href="/css/font_Icon/iconfont.css">
		<link rel="stylesheet" type="text/css" href="/css/chat.css">


		<script>

            var user = JSON.parse(sessionStorage.getItem('user'));

			$(function () {

			    //列表跳转
				$('.nav-link').click(function () {
					var page = $(this).data('page');
					if(page == 'invite'){			//邀请列表的跳转

						//好友邀请
					    $.get('/messages/invites',{id:user.id},function (data) {
							var addFriend = data.addFriend;
                            var crowdInvite = data.crowdInvite;  //两个都是pageInfo
                            console.log(crowdInvite);
                            $('.addFriend').renderValues({list:addFriend.list},{
                                get_href:function (item, value) {
                                    $(item).attr('href',$(item).data('href') + value);
                                }
                            });
							$('.crowdInvite').renderValues({list:crowdInvite.list},{
                                get_href:function (item, value) {
                                    $(item).attr('href',$(item).data('href') + value);
                                }
                            });

                        });


					}else if(page == 'dialogue'){

					}
                });

				//对话列表
                console.log(user.id);
                $.get('/messages/dialogClue/'+user.id,function (data) {
                    console.log(data);
                    $('.dialogClue').renderValues({list:data},{
                        get_data:function (item, value) {
                            $(item).attr('data-href', '/friend/interface/person/personDialog.html?id=' + value);
                        }
                    });
                });

                $('.dialogClue').on('click','.personDialog',function () {
                    window.location.href = $(this).data('href') + '&nickName=' + $(this).find('p').text();
                })

                //群会话列表
                $.get('/messages/crowdDialogClue/'+user.id,function (data) {
                    console.log(data);
                    $('.crowdDialog').renderValues({list:data},{
                        get_data:function (item, value) {
                            $(item).attr('data-href', '/friend/interface/person/crowdDialog.html?id=' + value);
                        }
                    });
                });

                $('.crowdDialog').on('click','.personDialog',function () {
                    window.location.href = $(this).data('href') + '&name=' + $(this).find('p').text();
                });

            });



		</script>
	</head>
	<body>
	<div class="search-head">

		<div class="row nav-search">

			<div class="col-2">
				<a href="/friend/index.html">
					<span><i class="fa fa-chevron-left fa-2x"></i></span>
				</a>
			</div>
			<div class="col-10">
				<!--<div class="chatBox-head-one">
					好友列表
					<div class="chat-close" style="margin: 10px 10px 0 0;font-size: 14px">关闭</div>
				</div>-->
				<div class="input-group-sm search">
					好友列表
					<div class="chat-close" style="font-size: 15px"><a href="/index.html">关闭</a></div>
					<!--<input class="form-control searchBtn" placeholder="找攻略">-->
				</div>
			</div>
		</div>
	</div>

		<ul class="nav nav-pills nav-justified border border-left-0 border-top-0 border-right-0" id="pills-tab" role="tablist">
			<li class="nav-item">
				<a class="nav-link active show" id="pills-dialogue-tab" data-toggle="pill" data-page="dialogue" href="#pills-dialogue">
					<span style="font-weight: bold;">会话</span>
				</a>
			</li>
			<li class="nav-item">
				<a class="nav-link" id="pills-crowd-tab" data-toggle="pill" data-page="crowd" href="#pills-crowd">
					<span style="font-weight: bold;">群会话</span>
				</a>
			</li>
			<li class="nav-item">
				<a class="nav-link" id="pills-invite-tab" data-toggle="pill" data-page="invite" href="#pills-invite">
					<span style="font-weight: bold;">邀请</span>
				</a>
			</li>
		</ul>

	<div class="tab-content" id="pills-tabContent">
		<div class="tab-pane fade active show" id="pills-dialogue">
			<div class="container dialogClue">
				<h6>会话列表</h6>
				<hr>
				<div class="chatBox-list" ref="chatBoxlist" render-loop="list">
					<div class="chat-list-people personDialog" render-fun="get_data" render-key="list.u_id">
                        <div><img render-src="list.u_headImgUrl" alt="头像"></div>
                        <div class="chat-name">
                            <p render-html="list.u_nickName"></p>
                        </div>
                        <div class="message-num" render-html="list.COUNT(*)"></div>
					</div>
				</div>
			</div>


		</div>
		<div class="tab-pane fade" id="pills-crowd">

			<div class="container crowdDialog">
				<h6>群会话</h6>
				<hr>
                <div class="chatBox-list" ref="chatBoxlist" render-loop="list">
                    <div class="chat-list-people personDialog" render-fun="get_data" render-key="list.c_id">
                        <div><img render-src="list.u_headImgUrl" alt="头像"></div>
                        <div class="chat-name">
                            <p render-html="list.c_name"></p>
                        </div>
                        <div class="message-num" render-html="list.COUNT(*)"></div>
                    </div>
                </div>
			</div>
		</div>
		<div class="tab-pane fade" id="pills-invite">
			<div class="container addFriend">
				<h6>好友申请</h6>
				<div class="chatBox-list" ref="chatBoxlist" render-loop="list">
					<a data-href="/friend/interface/responseProfiles.html?id=" render-fun="get_href" render-key="list.user.id">
						<div class="chat-list-people">
							<div><img render-src="list.user.headImgUrl" alt="头像"></div>
							<div class="chat-name">
								<p render-html="list.user.nickName"></p>
							</div>
							<div class="message-num" ><p render-html="list.user.genderDisplay"></p>在<p class="addr" render-html="list.user.place"></p></div>
						</div>
					</a>

				</div>
			</div>
			<hr>
			<div class="container crowdInvite">
				<h6>群邀请</h6>
				<div class="chatBox-list" ref="chatBoxlist" render-loop="list">
					<a data-href="/friend/interface/responseCrowd.html?id=" render-fun="get_href" render-key="list.c_id">
						<div class="chat-list-people">
							<div><img src="" alt="头像"></div>
							<div class="chat-name">
								<p render-html="list.c_name"></p>
							</div>
							<div class="message-num" render-html="list.COUNT(*)"></div>
						</div>
					</a>

				</div>
			</div>
		</div>
	</div>
	</body>

</html>